/**
 * Created by Administrator on 2017/3/21.
 */
import React, {Component} from 'react';
import {Form, Input, Radio, Select, Switch, Button, Tooltip, Icon, Row} from 'antd';
import request from '@/utils/request';
import {connect} from 'dva';
import styles from './index.less'
import {convertCurrency} from '@/utils/utils';

const FormItem = Form.Item;
const {TextArea} = Input;

const RadioGroup = Radio.Group;
const Option = Select.Option;

class AddPoliciesForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      level: 0,
      invoices: {detail: []},
      detail: {},
      mc: '',
      nsrsbr: '',
      dzdh: '',
      khh: '',
      sjhm: '',
      yxdz: '',
      bz: '',
      bz1: '',
      bz2: '',
      dzdh2: '',
      khh2: '',
      invoicing_type: '',
      step: 1,
      checked:true
    };
  }

  onChangeState = (tyle, e) => {
    this.setState({
      [tyle]: e.target.value
    })
  }

  componentDidMount() {
    const that = this;
    this.fetchDetail()
    var a = [1];

  }

  getPreView = () => {
    const that = this;
    console.log('this.state.checked',this.state.checked)
    request(`/paper_invoices/preview`, {
      method: 'GET',
      params: {
        detail_type:this.state.checked?1:2,
        payment_id: this.props.editRecord.id,
        invoicing_type: this.state.invoicing_type
      }
    }).then((response) => {
      console.log('response', response)
      if (response.status === 200) {
        for (let i = 0; i < response.data.data.length; i++) {
          let restLength = 8 - response.data.data[i].detail.length;
          if (that.state.invoicing_type === 3) {
            restLength = 4 - response.data.data[i].detail.length;

          }
          for (let j = 0; j < restLength; j++) {
            response.data.data[i].detail.push({})
          }

        }

        that.setState({
          invoices: response.data.data,
          dzdh2: '' + response.data.data[0].saleaddress + response.data.data[0].salephone,
          khh2: response.data.data[0].saleaccount,
          step: 2
        })


      }
    })
  }
  //获取基本信息
  fetchDetail = () => {
    const that = this;
    request(`/accounts/${this.props.editRecord.account.id}`, {
      method: 'GET',
      params: {},
    }).then((response) => {
      console.log('fetchDetail', response)
      if (response.status === 200) {
        that.setState({
          detail: response.data.data,
          mc: response.data.data.name,
          nsrsbr: response.data.data.buyer_tax_number,
          dzdh: response.data.data.buyer_address,
          khh: response.data.data.buyer_bank_account,
          sjhm: response.data.data.invoice_push_mobile,
          yxdz: response.data.data.invoice_push_email,
        })
      }


    });
  };
  renderInvoicesItem = (invoices_item) => {
    console.log('invoices_item', invoices_item)
    return invoices_item.detail.map((item, index) => {
      let itemTotal = Number(item.num * item.price);
      let itemTaxrate = itemTotal * (item.taxrate) / (1 + Number(item.taxrate))
      return <tr key={index} style={{height: '23px'}}>
        <td>{item.goodsname}</td>
        <td>{item.ggxh}</td>
        <td>{item.unit}</td>
        <td>{item.num}</td>
        <td>{item.price}</td>
        <td>{item.num ? (itemTotal - itemTaxrate).toFixed(2) : ''}</td>
        <td>{item.taxrate ? (item.taxrate==='0'?'免税':Number(item.taxrate) * 100 + '%') : ''}</td>
        <td>{item.taxrate ? Number(item.hsbz) ? itemTaxrate.toFixed(2) : '***' : ''}</td>
      </tr>
    })
  }
  renderInvoicesTable = () => {
    const invoicing_type = this.state.invoicing_type;
    const detail = this.state.detail;
    const invoices = this.state.invoices;
    console.log('invoices', invoices)
    return invoices.map((item, index) => {
      return <div key={index}>
        <h3 style={{
          textAlign: 'center',
          marginBottom: '16px',
          fontSize: '32px',
          color: (index === 1 || invoicing_type === 4|| invoicing_type === 7) ? '#ff7400' : '#1950a5',
          fontWeight: 'bold'
        }}>
          {invoicing_type === 1 && '电子普票'}
          {invoicing_type === 2 && '电子普票'}
          {invoicing_type === 4 && '专用纸票'}
          {invoicing_type === 3 && index === 0 && '专用纸票'}
          {invoicing_type === 3 && index === 1 && '电子普票'}
          {invoicing_type === 6 && '电子发票（普通发票）'}
          {invoicing_type === 7 && '电子发票（增值税专用发票）'}
          {invoicing_type === 8 && index === 0 && '电子发票（普通发票）'}
          {invoicing_type === 8 && index === 1 && '电子发票（增值税专用发票）'}
        </h3>
        {
          (invoicing_type === 6 || invoicing_type === 7|| invoicing_type === 8) ?
            <Form onSubmit={this.handleSubmit}>
              <table
                className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 7) ? styles.invoice_make_orange : ''}`}
                style={{width: '100%'}}>
                {detail.name &&
                  <tbody>
                  <tr>
                    <th
                      className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 7) ? styles.invoice_make_orange : ''}`}
                      style={{width: "26px", fontSize: '13px', padding: '0 4px'}}>购买方信息
                    </th>
                    <td style={{width: "50%"}}>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 7) ? styles.invoice_item_label2 : ''}`} style={{width:'214px'}}>名 <span
                          style={{marginLeft: '52px'}}>称</span> :</label>
                        <span className={styles.invoice_item_input_wrap} style={{marginLeft:'-214px',paddingLeft:'214px'}}>
                      <Input defaultValue={''} value={this.state.mc} onChange={(e) => {
                        this.onChangeState('mc', e)
                      }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 7) ? styles.invoice_item_label2 : ''}`}  style={{width:'214px'}}>统⼀社会信用代码/纳税⼈识别号
                          :</label>
                        <span className={styles.invoice_item_input_wrap} style={{marginLeft:'-214px',paddingLeft:'214px'}}>
                       <Input defaultValue={''} value={this.state.nsrsbr} onChange={(e) => {
                         this.onChangeState('nsrsbr', e)
                       }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 7) ? styles.invoice_item_label2 : ''}`}  style={{width:'214px'}}>地址
                          :</label>
                        <span className={styles.invoice_item_input_wrap} style={{marginLeft:'-214px',paddingLeft:'214px'}}>
                       <Input defaultValue={detail.buyer_address} value={this.state.dzdh} onChange={(e) => {
                         this.onChangeState('dzdh', e)
                       }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 7) ? styles.invoice_item_label2 : ''}`}  style={{width:'214px'}}>手机号码
                          :</label>
                        <span className={styles.invoice_item_input_wrap} style={{marginLeft:'-214px',paddingLeft:'214px'}}>
                        <Input defaultValue={detail.invoice_push_mobile} value={this.state.sjhm} onChange={(e) => {
                          this.onChangeState('sjhm', e)
                        }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 7) ? styles.invoice_item_label2 : ''}`}  style={{width:'214px'}}>开户行及帐号
                          :</label>
                        <span className={styles.invoice_item_input_wrap} style={{marginLeft:'-214px',paddingLeft:'214px'}}>
                       <Input defaultValue={detail.buyer_bank_account} value={this.state.khh} onChange={(e) => {
                         this.onChangeState('khh', e)
                       }} className={styles.invoice_item_input}/>
                    </span>
                      </div>

                    </td>
                    <th
                      className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 7) ? styles.invoice_make_orange : ''}`}
                      style={{width: "26px", fontSize: '13px', padding: '0 4px'}}>销售方
                    </th>
                    <td style={{width: "50%"}}>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 7) ? styles.invoice_item_label2 : ''}`}  style={{width:'214px'}}>名 <span
                          style={{marginLeft: '52px'}}>称</span> :</label>
                        <span className={styles.invoice_item_input_wrap} style={{marginLeft:'-214px',paddingLeft:'214px'}}>
                      <Input defaultValue={'吐鲁番天源水务有限公司'} disabled={true} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 7) ? styles.invoice_item_label2 : ''}`}  style={{width:'214px'}}>纳税人识别号
                          :</label>
                        <span className={styles.invoice_item_input_wrap} style={{marginLeft:'-214px',paddingLeft:'214px'}}>
                       <Input defaultValue={'91650402MABXHAWE5W'} disabled={true}
                              className={styles.invoice_item_input}/>
                    </span>
                      </div>
                    </td>
                  </tr>
                  </tbody>}

              </table>
              <table
                className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 7) ? styles.invoice_make_orange : ''}
           ${styles.invoice_list} ${(index === 1 || invoicing_type === 7) ? styles.invoice_list2 : ''}`} style={{
                width: '100%',
                borderBottom: '0', borderTop: '0', textAlign: 'center'
              }}>
                <thead>
                <tr>
                  <th>*简称*货物或应税劳务、服务名称</th>
                  <th>规格型号</th>
                  <th>单位</th>
                  <th>数量</th>
                  <th>单价（含税）</th>
                  <th>金额（含税）</th>
                  <th>税率</th>
                  <th>税额</th>
                </tr>
                </thead>
                <tbody>
                {this.renderInvoicesItem(item)}
                <tr style={{
                  height: '23px',
                  borderBottom: `2px solid ${(index === 1 || invoicing_type === 7) ? '#ff7400' : '#1950a5'}`
                }}>
                  <td>合计</td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td>￥{item.bhtaxtotal}</td>
                  <td></td>
                  <td>￥{item.taxtotal}</td>
                </tr>
                <tr style={{height: '23px'}}>
                  <td>价税合计(大写)</td>
                  <td colSpan="7"><span style={{
                    float: 'left',
                    marginLeft: '10px'
                  }}>{convertCurrency(item.taxtotal + item.bhtaxtotal)}</span>
                    <span style={{
                      float: 'right',
                      marginRight: '50px'
                    }}>(小写)￥{(item.taxtotal + item.bhtaxtotal).toFixed(2)}</span></td>
                </tr>
                </tbody>
                <tbody>
                </tbody>

              </table>

              <table
                className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 7) ? styles.invoice_make_orange : ''}`}
                style={{width: '100%'}}>
                {item.saleaddress &&
                  <tbody>
                  <tr>

                    <th
                      className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 7) ? styles.invoice_make_orange : ''}`}
                      style={{width: "26px", fontSize: '13px', padding: '0 4px'}}>备注
                    </th>
                    <td style={{width: "100%", verticalAlign: 'top'}}>
                      {
                        invoicing_type !== 8 &&
                        <TextArea defaultValue={''} value={this.state.bz} onChange={(e) => {
                          this.onChangeState('bz', e)
                        }} className={styles.invoice_item_input} autoSize={{minRows: 6, maxRows: 6}}/>
                      }
                      {
                        invoicing_type === 8 && index === 0 &&
                        <TextArea defaultValue={''} value={this.state.bz1} onChange={(e) => {
                          this.onChangeState('bz1', e)
                        }} className={styles.invoice_item_input} autoSize={{minRows: 6, maxRows: 6}}/>
                      }
                      {
                        invoicing_type === 8 && index === 1 &&
                        <TextArea defaultValue={''} value={this.state.bz2} onChange={(e) => {
                          this.onChangeState('bz2', e)
                        }} className={styles.invoice_item_input} autoSize={{minRows: 6, maxRows: 6}}/>
                      }
                    </td>
                  </tr>
                  </tbody>}

              </table>
              <table style={{width: '100%', marginTop: '10px'}}>
                <tbody>
                <tr>
                  <td style={{paddingLeft: '10px'}}> 收 款 人 : 努斯热提·赛提瓦力地</td>
                  <td> 复 核 : 吾斯曼江·吾买尔</td>
                  <td> 开 票 人 : {sessionStorage.getItem('username')}</td>
                  <td> 销 售 方 : (章)</td>
                </tr>
                </tbody>
              </table>

            </Form> :
            <Form onSubmit={this.handleSubmit}>
              <table
                className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 4) ? styles.invoice_make_orange : ''}`}
                style={{width: '100%'}}>
                {detail.name &&
                  <tbody>
                  <tr>
                    <th
                      className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 4) ? styles.invoice_make_orange : ''}`}
                      style={{width: "26px", fontSize: '13px', padding: '0 4px'}}>购买方
                    </th>
                    <td style={{width: "50%"}}>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>名 <span
                          style={{marginLeft: '52px'}}>称</span> :</label>
                        <span className={styles.invoice_item_input_wrap}>
                      <Input defaultValue={detail.name} value={this.state.mc} onChange={(e) => {
                        this.onChangeState('mc', e)
                      }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>纳税人识别号
                          :</label>
                        <span className={styles.invoice_item_input_wrap}>
                       <Input defaultValue={detail.buyer_tax_number} value={this.state.nsrsbr} onChange={(e) => {
                         this.onChangeState('nsrsbr', e)
                       }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>地址、 <span
                          style={{marginLeft: '10px'}}>电话</span> :</label>
                        <span className={styles.invoice_item_input_wrap}>
                       <Input defaultValue={detail.buyer_address} value={this.state.dzdh} onChange={(e) => {
                         this.onChangeState('dzdh', e)
                       }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>开户行及帐号
                          :</label>
                        <span className={styles.invoice_item_input_wrap}>
                       <Input defaultValue={detail.buyer_bank_account} value={this.state.khh} onChange={(e) => {
                         this.onChangeState('khh', e)
                       }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                    </td>
                    <th
                      className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 4) ? styles.invoice_make_orange : ''}`}
                      style={{width: "26px", fontSize: '13px', padding: '0 4px'}}>通知到
                    </th>
                    <td style={{width: "50%", verticalAlign: 'top'}}>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>手机号码
                          :</label>
                        <span className={styles.invoice_item_input_wrap}>
                        <Input defaultValue={detail.invoice_push_mobile} value={this.state.sjhm} onChange={(e) => {
                          this.onChangeState('sjhm', e)
                        }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>邮箱地址
                          :</label>
                        <span className={styles.invoice_item_input_wrap}>
                        <Input defaultValue={detail.invoice_push_email} value={this.state.yxdz} onChange={(e) => {
                          this.onChangeState('yxdz', e)
                        }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                    </td>
                  </tr>
                  </tbody>}

              </table>
              <table
                className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 4) ? styles.invoice_make_orange : ''}
           ${styles.invoice_list} ${(index === 1 || invoicing_type === 4) ? styles.invoice_list2 : ''}`} style={{
                width: '100%',
                borderBottom: '0', borderTop: '0', textAlign: 'center'
              }}>
                <thead>
                <tr>
                  <th>*简称*货物或应税劳务、服务名称</th>
                  <th>规格型号</th>
                  <th>单位</th>
                  <th>数量</th>
                  <th>单价（含税）</th>
                  <th>金额（含税）</th>
                  <th>税率</th>
                  <th>税额</th>
                </tr>
                </thead>
                <tbody>
                {this.renderInvoicesItem(item)}
                <tr style={{
                  height: '23px',
                  borderBottom: `2px solid ${(index === 1 || invoicing_type === 4) ? '#ff7400' : '#1950a5'}`
                }}>
                  <td>合计</td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td>￥{item.bhtaxtotal}</td>
                  <td></td>
                  <td>￥{item.taxtotal}</td>
                </tr>
                <tr style={{height: '23px'}}>
                  <td>价税合计(大写)</td>
                  <td colSpan="7"><span style={{
                    float: 'left',
                    marginLeft: '10px'
                  }}>{convertCurrency(item.taxtotal + item.bhtaxtotal)}</span>
                    <span style={{
                      float: 'right',
                      marginRight: '50px'
                    }}>(小写)￥{(item.taxtotal + item.bhtaxtotal).toFixed(2)}</span></td>
                </tr>
                </tbody>
                <tbody>
                </tbody>

              </table>

              <table
                className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 4) ? styles.invoice_make_orange : ''}`}
                style={{width: '100%'}}>
                {item.saleaddress &&
                  <tbody>
                  <tr>
                    <th
                      className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 4) ? styles.invoice_make_orange : ''}`}
                      style={{width: "26px", fontSize: '13px', padding: '0 4px'}}>销售方
                    </th>
                    <td style={{width: "50%"}}>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>名 <span
                          style={{marginLeft: '52px'}}>称</span> :</label>
                        <span className={styles.invoice_item_input_wrap}>
                      <Input defaultValue={'吐鲁番天源水务有限公司'} disabled={true} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>纳税人识别号
                          :</label>
                        <span className={styles.invoice_item_input_wrap}>
                       <Input defaultValue={'91650402MABXHAWE5W'} disabled={true}
                              className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>地址、 <span
                          style={{marginLeft: '10px'}}>电话</span> :</label>
                        <span className={styles.invoice_item_input_wrap}>
                       <Input disabled={true} defaultValue={'' + item.saleaddress + item.salephone}
                              value={this.state.dzdh2} onChange={(e) => {
                         this.onChangeState('dzdh2', e)
                       }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                      <div className={styles.invoice_item}>
                        <label
                          className={`${styles.invoice_item_label} ${(index === 1 || invoicing_type === 4) ? styles.invoice_item_label2 : ''}`}>开户行及帐号
                          :</label>
                        <span className={styles.invoice_item_input_wrap}>
                       <Input disabled={true} defaultValue={item.saleaccount} value={this.state.khh2}
                              onChange={(e) => {
                                this.onChangeState('khh2', e)
                              }} className={styles.invoice_item_input}/>
                    </span>
                      </div>
                    </td>
                    <th
                      className={`${styles.invoice_make_blue} ${(index === 1 || invoicing_type === 4) ? styles.invoice_make_orange : ''}`}
                      style={{width: "26px", fontSize: '13px', padding: '0 4px'}}>备注
                    </th>
                    <td style={{width: "50%", verticalAlign: 'top'}}>
                      {
                        invoicing_type !== 3 &&
                        <TextArea defaultValue={''} value={this.state.bz} onChange={(e) => {
                          this.onChangeState('bz', e)
                        }} className={styles.invoice_item_input} autoSize={{minRows: 6, maxRows: 6}}/>
                      }
                      {
                        invoicing_type === 3 && index === 0 &&
                        <TextArea defaultValue={''} value={this.state.bz1} onChange={(e) => {
                          this.onChangeState('bz1', e)
                        }} className={styles.invoice_item_input} autoSize={{minRows: 6, maxRows: 6}}/>
                      }
                      {
                        invoicing_type === 3 && index === 1 &&
                        <TextArea defaultValue={''} value={this.state.bz2} onChange={(e) => {
                          this.onChangeState('bz2', e)
                        }} className={styles.invoice_item_input} autoSize={{minRows: 6, maxRows: 6}}/>
                      }
                    </td>
                  </tr>
                  </tbody>}

              </table>
              <table style={{width: '100%', marginTop: '10px'}}>
                <tbody>
                <tr>
                  <td style={{paddingLeft: '10px'}}> 收 款 人 : 努斯热提·赛提瓦力地</td>
                  <td> 复 核 : 吾斯曼江·吾买尔</td>
                  <td> 开 票 人 : {sessionStorage.getItem('username')}</td>
                  <td> 销 售 方 : (章)</td>
                </tr>
                </tbody>
              </table>

            </Form>
        }
      </div>
    })
  }

  render() {
    const {getFieldDecorator} = this.props.form;
    const editRecord = this.props.editRecord;

    return (
      <div style={{fontSize: "13px"}}>
        {
          this.state.step === 1 &&
          <div>
            <div style={{width: '250px', margin: '50px auto'}}>
              {/*<div onClick={() => {
                this.setState({invoicing_type: 1}, function () {
                  this.getPreView()
                })
              }} style={{
                width: '200px',
                height: '60px',
                lineHeight: '60px',
                cursor: 'pointer',
                margin: '10px',
                display: 'inline-block',
                textAlign: 'center',
                border: '1px solid #ccc',
                borderRadius: '5px',
                background: '#0a82ff',
                color: '#fff',
                fontWeight: 'bold',
                fontSize: '18px'
              }}>电子普票 >
              </div>
              <div onClick={() => {
                this.setState({invoicing_type: 2}, function () {
                  this.getPreView()
                })
              }} style={{
                width: '200px',
                height: '60px',
                lineHeight: '60px',
                cursor: 'pointer',
                margin: '10px',
                display: 'inline-block',
                textAlign: 'center',
                border: '1px solid #ccc',
                borderRadius: '5px',
                background: '#0060c4',
                color: '#fff',
                fontWeight: 'bold',
                fontSize: '18px'
              }}>

                电子专票+电子普票 >
              </div>
              <div onClick={() => {
                this.setState({invoicing_type: 4}, function () {
                  this.getPreView()
                })
              }} style={{
                width: '200px',
                height: '60px',
                lineHeight: '60px',
                cursor: 'pointer',
                margin: '10px',
                display: 'inline-block',
                textAlign: 'center',
                border: '1px solid #ccc',
                borderRadius: '5px',
                background: '#ff7400',
                color: '#fff',
                fontWeight: 'bold',
                fontSize: '18px'
              }}>专用纸票 >
              </div>
              <div onClick={() => {
                this.setState({invoicing_type: 3}, function () {
                  this.getPreView()
                })
              }} style={{
                width: '200px',
                height: '60px',
                lineHeight: '60px',
                cursor: 'pointer',
                margin: '10px',
                display: 'inline-block',
                textAlign: 'center',
                border: '1px solid #ccc',
                borderRadius: '5px',
                background: '#bd0e21',
                color: '#fff',
                fontWeight: 'bold',
                fontSize: '18px'
              }}>专用纸票+电子普票 >
              </div>*/}
              <div style={{marginBottom:'10px',display:'flex',justifyContent:'space-between'}}>
                <span>发票是否含下水:</span>
                <Switch onChange={(checked)=>{
                  this.setState({
                    checked
                  })
                }} checkedChildren="含下水" unCheckedChildren="不含下水" checked={this.state.checked} />
              </div>

              <div onClick={() => {
                this.setState({invoicing_type: 6}, function () {
                  this.getPreView()
                })
              }} style={{
                width: '250px',
                height: '60px',
                lineHeight: '60px',
                cursor: 'pointer',
                margin: '10px',
                display: 'inline-block',
                textAlign: 'center',
                border: '1px solid #ccc',
                borderRadius: '5px',
                background: '#0060c4',
                color: '#fff',
                fontWeight: 'bold',
                fontSize: '18px'
              }}>数电普票 >
              </div>
              <div onClick={() => {
                this.setState({invoicing_type: 7}, function () {
                  this.getPreView()
                })
              }} style={{
                width: '250px',
                height: '60px',
                lineHeight: '60px',
                cursor: 'pointer',
                margin: '10px',
                display: 'inline-block',
                textAlign: 'center',
                border: '1px solid #ccc',
                borderRadius: '5px',
                background: '#ff7400',
                color: '#fff',
                fontWeight: 'bold',
                fontSize: '18px'
              }}>数电专票 >
              </div>

              <div onClick={() => {
                this.setState({invoicing_type: 8}, function () {
                  this.getPreView()
                })
              }} style={{
                width: '250px',
                height: '60px',
                lineHeight: '60px',
                cursor: 'pointer',
                margin: '10px',
                display: 'inline-block',
                textAlign: 'center',
                border: '1px solid #ccc',
                borderRadius: '5px',
                background: '#bd0e21',
                color: '#fff',
                fontWeight: 'bold',
                fontSize: '18px'
              }}>数电普票+数电专票 >
              </div>

            </div>
          </div>
        }
        {
          this.state.step === 2 && this.renderInvoicesTable()

        }

      </div>
    );
  }
}

const AddPoliciesFormWrap = Form.create()(AddPoliciesForm);
export default connect()(AddPoliciesFormWrap);
